<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <input type="text" name="" id="" />
    <input type="button" value="平方" onclick="f()" />
    <h1>结果:<span></span></h1>

    <script>
      let t = document.querySelector("input");
      let s = document.querySelector("span");
      function f() {
        if (isNaN(t.value)) {
          s.innerText = "输入错误";
          return;
        }
        s.innerText = t.value * t.value;

        // 进行加法运算，直接使用+号会进行字符串拼接，所以先将其转换成整数或小数
        s.innerText = parseFloat(t.value) + parseFloat(t.value);
        s.innerText = t.value * 1 + t.value * 1;
      }
    </script>
  </body>
</html>
